<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>收款统计</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="css/comm.css" />
    <link rel="stylesheet" type="text/css" href="css/analysis_historyfeesummary.css" />
</head>

<body>
    <div id="app" v-cloak>
        <div v-on:click="doHideSearch()" v-if="showsearch" class="maskbg">
        </div>
        <div v-if="showsearchparam" class="searchparam">
            <div class="searchcontent">
                <div class="searchparamtitle" v-if="companyList.length>0">
                    统计维度
                </div>
                <div class="searchparamitem" v-if="companyList.length>0">
                    <label v-on:click="doSelectProjectCompany(item.ID)" v-bind:class="{'active':form.ProjectCompanyType==item.ID}" v-for="item in projectCompanyList">{{item.Name}}</label>
                </div>
                <div class="searchparamtitle">
                    收款方式
                </div>
                <div class="searchparamitem">
                    <label v-on:click="doSelectChargeMoneyType(item.ID)" v-bind:class="{'active':form.ChargeMoneyTypes.indexOf(item.ID)>-1}" v-for="item in chargeMoneyTypeList">{{item.Name}}</label>
                </div>
                <div class="searchparamtitle">
                    收费项目
                </div>
                <div class="searchparamitem">
                    <label v-on:click="doSelectChargeCategory(item.ID)" v-bind:class="{'active':form.ChargeIDList.indexOf(item.ID)>-1}" v-for="item in chargeSummaryList">{{item.Name}}</label>
                </div>
                <div class="searchparamtitle" v-if="form.ProjectCompanyType==1">
                    项目名称
                </div>
                <div class="searchparamitem" v-if="form.ProjectCompanyType==1">
                    <label v-on:click="doSelectProject(item.ID)" v-bind:class="{'active':form.ProjectIDs.indexOf(item.ID)>-1}" v-for="item in projectList">{{item.Name}}</label>
                </div>
                <div class="searchparamtitle" v-if="form.ProjectCompanyType==2">
                    公司名称
                </div>
                <div class="searchparamitem" v-if="form.ProjectCompanyType==2">
                    <label v-on:click="doSelectCompany(item.ID)" v-bind:class="{'active':form.CompanyIDs.indexOf(item.ID)>-1}" v-for="item in companyList">{{item.Name}}</label>
                </div>
                <div class="aui_bottom">
                    <div v-on:click="doReset(1)" class="aui_bottombtn left">重置</div>
                    <div v-on:click="doSearch()" class="aui_bottombtn right">确认</div>
                </div>
            </div>
        </div>
        <div v-if="showsearchmonth" class="searchparam">
            <div class="searchparamitem">
                <label v-bind:class="{'active':form.activeDate==1}" v-on:click="doClickDay(1)">今日</label>
                <label v-bind:class="{'active':form.activeDate==2}" v-on:click="doClickDay(2)">本月</label>
                <label v-bind:class="{'active':form.activeDate==3}" v-on:click="doClickDay(3)">本年</label>
            </div>
            <div class="searchparamtitle">
                自定义收款日期
            </div>
            <div class="searchparamitem">
                <input v-on:click="do_select_time(1)" v-model="form.startTime" readonly="readonly" type="text" placeholder="开始日期">
                <span style="padding: 0 10px;">
                  至
                </span>
                <input v-on:click="do_select_time(2)" v-model="form.endTime" readonly="readonly" type="text" placeholder="结束日期">
            </div>
            <div class="aui_bottom">
                <div v-on:click="doReset(2)" class="aui_bottombtn left">重置</div>
                <div v-on:click="doSearch()" class="aui_bottombtn right">确认</div>
            </div>
        </div>
        <div class="aui-content">
            <div class="search_box" v-bind:class="{'fixedbox':showsearch}">
                <div class="searchitem" v-on:click="doSelectSearchParam(1)">
                    筛选
                    <i v-if="!showsearchparam" class="icon iconfont icon-down"></i>
                    <i v-if="showsearchparam" class="icon iconfont icon-shangjiantou"></i>
                </div>
                <div class="searchitem" v-on:click="doSelectSearchParam(2)">
                    本月
                    <i v-if="!showsearchmonth" class="icon iconfont icon-down"></i>
                    <i v-if="showsearchmonth" class="icon iconfont icon-shangjiantou"></i>
                </div>
                <!-- <div class="searchtotal">
                    总计:<label>￥12345.00</label>
                </div> -->
            </div>
            <div class="border-btnline litile-line"></div>
            <div class="totalcost">
                <div class="totalcosttext">
                    总收入
                </div>
                <div class="totalcostnumber">
                    <span>￥{{summary.TotalCost}}</span> ({{summary.totalRoomCount}}户)
                </div>
            </div>
            <section class="aui-grid categorybox">
                <div class="aui-row">
                    <div class="aui-col-xs-6" v-for="item in summary.category_list">
                        <span>{{item.Name}}</span>
                        <label>￥{{item.Cost}}</label>
                    </div>
                </div>
            </section>
            <div class="chartcontainer">
                <div id="container" style="min-height: 300px;"></div>
            </div>
            <div class="roomsummary">
                <div class="room_itembox" v-for="item in summary.projectFeeList">
                    <div class="room_title">
                        {{item.Name}}
                        <div class="room_right">
                            <span>￥{{item.TotalCost}}</span>
                            <i class="icon iconfont icon-down"></i>
                        </div>
                    </div>
                    <div class="border-btnline litile-line"></div>
                    <div class="room_item">
                        <div class="room_title" v-for="item2 in item.chargeCategoryList">
                            {{item2.ChargeName}}
                            <div class="room_right">
                                <span>￥{{item2.TotalCost}}</span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="room_itembox" v-for="item in summary.companyFeeList">
                    <div class="room_title">
                        {{item.Name}}
                        <div class="room_right">
                            <span>￥{{item.TotalCost}}</span>
                        </div>
                    </div>
                    <div class="border-btnline litile-line"></div>
                </div>
            </div>
        </div>
    </div>
</body>
<script type="text/javascript " src="../script/api.js "></script>
<script type="text/javascript " src="../script/vue.js "></script>
<script type="text/javascript" src="../script/config.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/aui-toast.js"></script>
<script type="text/javascript" src="../script/page/dateRangeUtil.js"></script>
<script type="text/javascript" src="../script/highcharts/highcharts.js"></script>
<script type="text/javascript" src="../script/highcharts/modules/exporting.js"></script>
<script type="text/javascript" src="js/analysis_historyfeesummary.js"></script>

</html>
